<!DOCTYPE html>
<html lang="en" ng-app="loklak">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="Content-Language" content="en, english"/>
    <meta name="author" content="@0rb1t3r"> <!-- CHANGE THIS -->
    <link rel="icon" type="image/png" href="../../artwork/favicon.png">
    <title>loklak.org - Apps Boilerplate</title> <!-- CHANGE THIS -->

    <link href="/css/bootstrap.min.css" rel="stylesheet">
    <link href="/css/loklak.css" rel="stylesheet">
    <link href="/css/boilerplatetheme.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="../../js/html5shiv.min.js"></script>
      <script src="../../js/respond.min.js"></script>
    <![endif]-->

    <script src="/js/angular.min.js"></script>
    <script src="/js/angular-route.min.js"></script>
    <script src="/js/loklak.js"></script>

    <style>
      p a{
        color: rgb(51,122,183);
      }
      p a:hover{
        color: rgb(51,122,183)
      }
    </style>
  </head>

  <body>

    <div class="container-fluid">
      <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
          <ul class="nav nav-sidebar">
            <li><a href="#section1">section1</span></a></li> <!-- CHANGE THIS -->
            <li><a href="#section2">section2</span></a></li> <!-- CHANGE THIS -->
            <li><a href="#section3">section3</span></a></li> <!-- CHANGE THIS -->
          </ul>
        </div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
          <!-- CHANGE ALL THIS -->
          <h1 class="page-header">loklak App Boilerplate</h1>
          <p>This is the loklak app boilerplate. You can copy this file to quick-start your own loklak app!</p>

          <br id="section1"/><br/>
          <h2 class="sub-header">section 1</h2>
          <p>This boilerplate has three demo sections which are linked with the menu on
             the left side. You probably don't need sections, then simply delete them.</p>

          <br id="section2"/><br/>
          <h2 class="sub-header">section 2</h2>
          <p>To learn how to create an app, please read
             <a href="https://github.com/fossasia/apps.loklak.org/blob/master/README.md">the apps readme</a></p>

          <br id="section2"/><br/>
          <h2 class="sub-header">section 3</h2>
          <p>Thanks to one of our Google Code-In students, the annoying white line at the bottom
             of this page has ceased to exist. Whew!</p>
        </div>
      </div>
    </div>

    <footer>
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-10">
            <a class="left" href="http://apps.loklak.org">Loklak Apps</a>
          </div>
          <div class="col-md-2">
            <a class="right" href="https://github.com/fossasia/apps.loklak.org/blob/master/README.md">Create a Loklak app</a>
          </div>
        </div>
      </div>
    </footer>


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="/js/jquery.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <script src="/js/ie10-viewport-bug-workaround.js"></script>
  </body>
</html>
